import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Route, withRouter } from 'react-router-dom';
import { compose } from 'ramda';
import { createFragmentContainer } from 'react-relay';
import graphql from 'babel-plugin-relay/macro';
import { withStyles } from '@material-ui/core/styles';
import inject18n from '../../../components/i18n';
import EntityStixRelations from '../stix_relation/EntityStixRelations';
import StixDomainEntityKnowledge from '../stix_domain_entity/StixDomainEntityKnowledge';
import StixRelation from '../stix_relation/StixRelation';
import MalwareHeader from './MalwareHeader';
import MalwareKnowledgeBar from './MalwareKnowledgeBar';

const styles = () => ({
  container: {
    margin: 0,
  },
  content: {
    paddingRight: 260,
  },
});

const inversedRoles = ['usage'];

class MalwareKnowledgeComponent extends Component {
  render() {
    const { classes, malware } = this.props;
    const link = `/dashboard/threats/malwares/${malware.id}/knowledge`;
    return (
      <div className={classes.container}>
        <MalwareHeader malware={malware} variant="noalias" />
        <MalwareKnowledgeBar malwareId={malware.id} />
        <div className={classes.content}>
          <Route
            exact
            path="/dashboard/threats/malwares/:malwareId/knowledge/relations/:relationId"
            render={routeProps => (
              <StixRelation
                entityId={malware.id}
                inversedRoles={inversedRoles}
                {...routeProps}
              />
            )}
          />
          <Route
            exact
            path="/dashboard/threats/malwares/:malwareId/knowledge/overview"
            render={routeProps => (
              <StixDomainEntityKnowledge
                stixDomainEntityId={malware.id}
                stixDomainEntityType='malware'
                {...routeProps}
              />
            )}
          />
          <Route
            exact
            path="/dashboard/threats/malwares/:malwareId/knowledge/usage"
            render={routeProps => (
              <EntityStixRelations
                entityId={malware.id}
                relationType="uses"
                targetEntityTypes={['Intrusion-Set', 'Identity']}
                entityLink={link}
                {...routeProps}
              />
            )}
          />
          <Route
            exact
            path="/dashboard/threats/malwares/:malwareId/knowledge/variants"
            render={routeProps => (
              <EntityStixRelations
                entityId={malware.id}
                relationType="variant-of"
                targetEntityTypes={['Malware']}
                entityLink={link}
                {...routeProps}
              />
            )}
          />
          <Route
            exact
            path="/dashboard/threats/malwares/:malwareId/knowledge/campaigns"
            render={routeProps => (
              <EntityStixRelations
                entityId={malware.id}
                relationType="uses"
                targetEntityTypes={['Campaign']}
                entityLink={link}
                {...routeProps}
              />
            )}
          />
          <Route
            exact
            path="/dashboard/threats/malwares/:malwareId/knowledge/incidents"
            render={routeProps => (
              <EntityStixRelations
                entityId={malware.id}
                relationType="uses"
                targetEntityTypes={['Incident']}
                entityLink={link}
                {...routeProps}
              />
            )}
          />
          <Route
            exact
            path="/dashboard/threats/malwares/:malwareId/knowledge/victimology"
            render={routeProps => (
              <EntityStixRelations
                entityId={malware.id}
                relationType="targets"
                targetEntityTypes={[
                  'Organization',
                  'Sector',
                  'Country',
                  'Region',
                ]}
                entityLink={link}
                exploreLink={`/dashboard/explore/victimology/${malware.id}`}
                {...routeProps}
              />
            )}
          />
          <Route
            exact
            path="/dashboard/threats/malwares/:malwareId/knowledge/ttp"
            render={routeProps => (
              <EntityStixRelations
                entityId={malware.id}
                relationType="uses"
                targetEntityTypes={['Attack-Pattern']}
                entityLink={link}
                exploreLink={`/dashboard/explore/attack_patterns/${malware.id}`}
                {...routeProps}
              />
            )}
          />
          <Route
            exact
            path="/dashboard/threats/malwares/:malwareId/knowledge/tools"
            render={routeProps => (
              <EntityStixRelations
                entityId={malware.id}
                relationType="uses"
                targetEntityTypes={['Tool']}
                entityLink={link}
                {...routeProps}
              />
            )}
          />
          <Route
            exact
            path="/dashboard/threats/malwares/:malwareId/knowledge/vulnerabilities"
            render={routeProps => (
              <EntityStixRelations
                entityId={malware.id}
                relationType="targets"
                targetEntityTypes={['Vulnerability']}
                entityLink={link}
                {...routeProps}
              />
            )}
          />
        </div>
      </div>
    );
  }
}

MalwareKnowledgeComponent.propTypes = {
  malware: PropTypes.object,
  classes: PropTypes.object,
  t: PropTypes.func,
};

const MalwareKnowledge = createFragmentContainer(MalwareKnowledgeComponent, {
  malware: graphql`
    fragment MalwareKnowledge_malware on Malware {
      id
      ...MalwareHeader_malware
    }
  `,
});

export default compose(
  inject18n,
  withRouter,
  withStyles(styles),
)(MalwareKnowledge);
